简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
스크립트 구성 요소를 사용하여 Next.js의 헤더에 스크립트 삽입
P粉458913655
P粉458913655 2023-08-25 08:55:35
0
1
445
<p>Next.js 애플리케이션의 모든 페이지에 있는 헤드 섹션에 Zoho라는 애플리케이션의 추적 코드를 삽입하고 싶습니다. _document.tsx라는 파일을 사용하고 있는데 잘 작동합니다. 왜곡된 스크립트의 경우 Next.js에서는 Next.js 스크립트 구성 요소(https://nextjs.org/docs/messages/no-script-tags-in-head-comComponent)를 사용할 것을 권장합니다. 지침에 따라 스크립트를 괄호 안에 삽입했지만 오류 메시지 없이 무시되었습니다._document.tsx 파일의 Head 섹션에 이 코드를 입력할 수 있나요? 별도의 구성 요소로 분할하는 것이 더 낫습니까?</p> <p>任何建议道将有所帮助</p> <pre class="brush:php;toolbar:false;">문서 가져오기, { HTML, 머리, 기본, 다음스크립트, 문서컨텍스트, DocumentInitialProps, } "다음/문서"에서;; "next/script"에서 스크립트 가져오기;; MyDocument 클래스는 Document {를 확장합니다. 정적 비동기 getInitialProps( ctx: DocumentContext ): 약속<DocumentInitialProps> { constinitialProps = Document.getInitialProps(ctx)를 기다립니다; return { ...initialProps }; } 렌더링() { 반품 ( <Html lang="en"> <머리> <meta charSet="utf-8" /> <링크 href="https://fonts.googleapis.com/css?family=PT+Sans&display=선택 사항" rel="스타일시트" /> <메타 이름="msapplication-TileColor" 콘텐츠="#596285" /> <메타 name="msapplication-config" content="/favicon/browserconfig.xml" /> <메타 이름="테마-색상" 내용="#ffffff" /> {/* Zoho 마케팅 자동화용 */} <스크립트 id="zoho-ma"> {`var w = 창; var p = w.location.protocol; if (p.indexOf("http") < 0) { p = "http" + ":";; } var d = 문서; var f = d.getElementsByTagName("스크립트")[0], s = d.createElement("스크립트"); s.type = "텍스트/자바스크립트"; s.async = 거짓; if (s.readyState) { s.onreadystatechange = 함수() { if (s.readyState == "로드됨" || s.readyState == "완료") { s.onreadystatechange = null; 노력하다 { 로드와프롭( "myid#", "myid#", "myid#", "myid#", "0.0" ); } 잡기 (e) {} } }; } 또 다른 { s.onload = 함수() { 노력하다 { 로드와프롭( "myid#", "myid#", "myid#", "myid#", "0.0" ); } 잡기 (e) {} }; }s.src = p + "//ma.zoho.com/hub/js/WebsiteAutomation.js";; f.parentNode.insertBefore(s, f);`} </스크립트> {/* Zoho 마케팅 자동화 종료 */} </머리> <본문> <메인 /> <다음스크립트 /> <div id="알림"></div> </body> </Html> ); } } 기본 MyDocument 내보내기;</pre>
P粉458913655
P粉458913655

모든 응답(1)
P粉818125805
P粉8181258052023-08-26 00:03:41 1층

이전 게시물을 다시 읽었습니다다음 11 스크립트 태그를 추가해도 작동하지 않습니다. 스크립트가 렌더링되지 않습니다 여기에 링크 설명을 입력하세요. 그리고 Head 태그에 <Script> 구성 요소를 넣을 수 없다는 것을 깨달았습니다. 또한 _document.tsx가 아니라 _app.tsx에 있어야 합니다(beforeInteractive를 사용하지 않는 한 위 링크 참조).

Google Analytics 스크립트도 포함시키고 싶어서 TrackingCode라는 컴포넌트를 별도의 js 파일로 만들었습니다.

으아악

내 _app.tsx 파일은 다음과 같습니다:

으아악
좋다 +0
답글 추가
인기 주제
더>
인기 기사
인기 튜토리얼
더>
관련 튜토리얼
인기 추천
최신 강좌
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿
회사 소개 부인 성명 Sitemap
PHP 중국어 웹사이트：공공복지 온라인 PHP 교육，PHP 학습자의 빠른 성장을 도와주세요！