programing

파이어베이스 호스팅이 앱을 표시하지 않습니까?

lovejava 2023. 6. 23. 21:09

파이어베이스 호스팅이 앱을 표시하지 않습니까?

저는 파이어베이스에 처음이며, 파이어베이스에 앱을 배포하려고 합니다.나는 모든 단계를 따랐습니다.그런데 무슨 이유에서인지 앱이 안 나옵니다.저는 제 웹 앱 대신 웰컴 모달을 받고 있습니다.이미지는 다음과 같습니다.

enter image description here

배포하는 단계는 다음과 같습니다.

1단계:

ng build --prod

2단계:

firebase init

    *Are you ready to proceed?* Yes

    *What do you want to use as your public directory?* dist/{your-application-name}

    *Configure as a single-page app (rewrite all urls to /index.html)?(y/N)* Yes

    *File dist/{your-application-name}/index.html already exists. Overwrite?(y/N)* No

3단계:

firebase deploy --only hosting

그래도 같은 페이지가 표시되면 'CTRL + F5'를 누르면 캐시가 정리됩니다.

왜냐하면.index.html 수정되었습니다. 를 했을 때 가 으로 수정되었습니다."Y"화재 기지를 초기화하는 동안.기본적으로 사용자 자신의 인덱스 파일을 이 인덱스 파일로 대체했습니다.인덱스 파일을 확인하고 교체한 다음에는 index.html 파일을 덮어쓰지 않습니다.효과가 있을 겁니다.

저도 같은 문제에 직면했습니다.저의 경우에는 화재 기지와 관련된 문제가 아니었습니다.캐시를 삭제하는 것이 해결책이었습니다.

파이어베이스 호스팅이 앱을 표시하지 않습니까?

이 문제에는 두 가지 이유가 있을 수 있습니다.

첫 번째 단계:

index.html을 포함하는 공용 폴더(firebase.json에서 정의) 'dist'가 firebase init 명령에 의해 수정되지 않았는지 확인하십시오. 만약 그렇다면 원래 프로젝트 인덱스.html로 대체하십시오.

참조용(dist는 표준이지만 사용자가 다를 수 있음)

{
  "hosting": {
    "public": "dist"    
  }
}

두 번째 단계:

프로젝트의 index.html에서 기본 href를 구성해야 합니다.

~하듯이

< base href="https://["YOUR FIREBASE PROJECT NAME"].firebaseapp.com/">

및 기타 번들 파일을 다음과 같이 지정합니다.

< script type="text/javascript" src="https://["YOUR FIREBASE PROJECT NAME"].firebaseapp.com/runtime.a66f828dca56eeb90e02.js"></script>

< script type="text/javascript" src="https://["YOUR FIREBASE PROJECT NAME"].firebaseapp.com/polyfills.14fc14f3e029a8cfd046.js"></script>

< script type="text/javascript" src="https://["YOUR FIREBASE PROJECT NAME"].firebaseapp.com/main.2eb2046276073df361f7.js"></script>

에서는 명령 합니다.firebase deploy

즐기세요! ;)

나는 이 문제로 달려갔고,

만약 누군가 firebase init 명령을 사용한 후에 같은 일을 당했다면,

공용 폴더에서 index.dll 파일을 확인합니다(반응 여부).

화재 기지에 의해 무시되었을 수도 있습니다.

파이어베이스에 기존 index.dll 파일을 덮어쓰지 않도록 하기 위해,

Firebase에서 기존 index.html 파일을 재정의할지 묻는 메시지가 나타나면 'N'을 입력합니다.

만약 누군가가 이 일 때문에 여기에 있다면,

web.app으로 끝나는 일부 도메인은 ISP 제공자로부터 차단된 것 같습니다. 일부 국가의 경우 개인 VPN을 사용하여 수정될 때까지 사이트에 액세스했습니다.

보시면 또 의 스크린샷이 있습니다.index.htmlFirebase에서 생성한 파일로, 자신의 파일이 아닌 이 파일을 가리킵니다.다음은 해결 방법입니다.

  1. 생성 파이어베이스 index.html그리고 당신의 것을 유지합니다.
  2. 다음을 사용하여 다시 배포firebase deploy

나 자신에게, 문제는 앱 위치에 절대적인 경로를 제공했다는 것입니다.firebase init상대적인 길만 택하는 것 같습니다.

Angular v6 CLI 프로젝트를 통해 공유 코드베이스가 있는 여러 앱을 더 쉽게 만들 수 있습니다.따라서 dist 내의 새 폴더.

dotGitignore 답변 인용:

저는 ng build --prod가 프로젝트 위치가 있는 이 아래에 dist와 다른 하위 폴더를 생성한다는 것을 발견했습니다.

https://stackoverflow.com/a/50360478/11652243 에서 해결 방법을 확인하십시오.

유일한 해결책은 firebase deploy file이 index.tml이지만 빌드 파일이 필요하므로 당신의 파일을 교체하십시오.

{
  "hosting": {
    "public": "build",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ],
    "rewrites": [
      {
        "source": "**",
        "destination": "/index.html"
      }
    ]
  }
}

그냥 화력 기지를 교체하세요.이것으로 json 파일을 만들면 마법을 보게 될 것입니다.

해결책은 첫 번째 링크 대신 파이어베이스에서 제공하는 두 번째 링크를 사용하는 것이었습니다.

사용:your-project-id.firebaseapp.com뜻은 다음과 같습니다.)your-project-id.web.app)

실제로 아무것도 필요하지 않은 경우가 몇 가지 있습니다.모든 정적 파일을 선택한 공용 폴더로 이동합니다.use 명령어

firebase deploy

그리고 ctrl+f5를 눌러 캐시를 클리어하면 됩니다.

저는 파이어베이스에서 웹사이트를 배포할 때 비슷한 문제에 직면했습니다.

Firebase는 일반적으로 web.app 및 firebaseapp.com 라는 두 개의 기본 도메인을 만듭니다.둘 중 하나가 잘 안 되면 다른 것을 사용하세요.

이것으로 저의 문제가 해결되었습니다.해보세요!

파일을 Firebase에 업로드해야 합니다.

아니면, 타기, 용사를 하세요.firebase deploy --only hosting공용 디렉터리에서 파이어베이스로 파일에 배포합니다.

일반적인 배포에 대해 다음 단계를 수행합니다.https://alligator.io/angular/deploying-angular-app-to-firebase/

당신은 dist 폴더 내의 index.html이 Firebase에 의해 재생되는지 확인해야 합니다.

그렇다면 Firebase에서 수정한 html 파일을 삭제하고 새 index.html 파일을 만든 다음 실제로 생성된 index.html로 내용을 강제 업데이트하기만 하면 됩니다.$ ng build --prod 이제입을 입력합니다.$ firebase deploy --only hosting.

따라서 index.html 파일 내용과 위치를 주의하십시오.해당 위치가 dist 폴더가 아닌 경우.당신은 소방 기지에서 공공 장소에 적합한 위치를 제공해야 합니다.json 파일.

저도 같은 문제가 있어요.다음 단계를 수행합니다.

그 안의 화기 기지.

*Are you ready to proceed?* Yes

Make a public folder and Copy your all files into it

*What do you want to use as your public directory?*(public) -->only press enter

*Configure as a single-page app (rewrite all urls to /index.html)?(y/N)* N

*File public/index.html already exists. Overwrite?(y/N)* No

이상으로 당신의 앱이 호스팅될 것입니다...

@arslan의 대답은 제가 여기서 도움이 되었고, 저를 위해 일했고, 빈 웹 페이지에서 제 앱을 볼 수 있게 되었습니다.

내 솔루션:저는 제 화력 기지를 편집했습니다.json 파일을 실행한 다음 npm이 빌드를 실행한 다음 firebase 에뮬레이터:start 명령을 다시 실행합니다.파일을 변경했습니다.

{
  "functions": {
    "source": "functions"
  },
  "hosting": {
    "public": "public",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ],
    "rewrites": [
      {
        "source": "**",
        "destination": "/index.html"
      }
    ]
  }
}

...에게

{
  "hosting": {
    "public": "build",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ],
    "rewrites": [
      {
        "source": "**",
        "destination": "/index.html"
      }
    ]
  }
}

내 문제를 해결한 것은 무엇입니까?

  1. 실행 빌드(npm 실행 빌드)

  2. 수동으로 Firebase를 추가합니다.json 및 .firebasesrc 파일을 루트 폴더에 저장

  3. 화력 기지를 확보하세요.json hosting->public은 "build"로 설정되었습니다.

  4. 소방 기지 배치 실행

저도 같은 문제가 있었습니다. 이상한 이유로 화재 기지를 깨달았습니다.json은 내 레포에 없었습니다.위의 예제에서 구성을 사용하여 작성한 후 다시 Firebase를 실행하여 제 Firebase를 찾았습니다.json과 그것을 수정했고, 그것은 작동했습니다.

동일한 문제가 발생하여 다음 단계로 해결했습니다.

HACK 솔루션

단계:1 빌드 폴더로 이동하여 index.html을 index.html(공용 폴더)로 바꿉니다.

단계:2 실행 명령: npm 빌드 실행

단계:3 NO => File dist/{your-application-name}/index.dist가 이미 있습니다. 덮어쓰기? (y/N) 아니요

단계:4 그런 다음 링크로 이동하여 Ctrl+f5를 누릅니다.당신의 앱이 당신 앞에 있을 것입니다.:)

firebase init 명령 후 public 또는 dist 폴더로 이동하여 firebase 관련 파일을 제외한 모든 파일(폴더가 아님)을 선택하고 dist 또는 public 폴더에 복사합니다.이 후 명령 firebase deploy를 실행하고 잠시 기다립니다.완료 후 언급된 url로 이동하면 작동 중인 앱을 찾을 수 있습니다.

Firebase에서 Firebase를 실행하면 프로젝트 폴더에 파일 구조가 생성되고 선택한 항목에 따라 공용 파일에 대한 /public 폴더(또는 지정한 경우 다른 이름)가 생성됩니다.또한 해당 /public 폴더 내에 현재 보고 있는 시작 메시지가 들어 있는 index.html 파일을 만듭니다.앱 파일(웹 페이지 등)을 가져가서 해당 공용 폴더로 이동하고 해당 index.html 파일을 함께 교체해야 합니다.이 작업을 수행한 후 "firebase deploy" 명령을 실행하면 업데이트되고 앱이 표시됩니다.

배포하기 전에 파일이 새로 생성된 디렉토리(예: egy 또는 공용 폴더)에 있는지 확인합니다.

나의 경우에는 로 건축한 후에.ng build나는 파이어베이스에 소스 디렉토리가 있다고 말했습니다.dist하지만 사실은 그랬습니다.dist/my-project...

(화재 기지 지수가 있었습니다.)dist각도 지수.각도가 있었습니다.dist/my-project...)

이 경우 로그아웃해야 하는 경우가 있습니다.firebase logout사용자의 CLI에서
그런 다음 다시 로그인합니다.firebase login.

을 위한 하고 Firebase를 합니다.Firebase.initializeApp()Floatter를 사용하는 경우 주요 방법에서.

이것은 저에게 효과가 있었습니다.

Firebase 디렉토리를 초기화하는 동안 공용 디렉토리로 빌드를 선택해야 합니다.더 런

1.npm run build
2.firbase deploy

이렇게 해도 작동하지 않으면 브라우저의 캐시를 지우십시오.

여기서 나는 질문에 대한 답을 찾았습니다.

1단계:

Initialize the firebase first. 

$firebase init


2단계:

Create a production build now. 

$ng build --prod


단계:3

It's time to deploy your app. 

$firebase deploy

언급URL : https://stackoverflow.com/questions/44274084/firebase-hosting-not-showing-up-app

'programing' 카테고리의 다른 글

사용자 지정 지역에 Firebase 배포(eu-central1)  (0) 2023.06.23
SQL Server에서 Polymorphic Association을 구현하는 가장 좋은 방법은 무엇입니까?  (0) 2023.06.23
Mongo 필드 A가 필드 B보다 큼  (0) 2023.06.23
MongoDB에 파일을 저장하려면 어떻게 해야 합니까?  (0) 2023.06.23
iis에서 작업자 프로세스로 인한 CPU 사용을 100% 방지하는 방법  (0) 2023.06.23

'programing'의 다른글

  • 현재글파이어베이스 호스팅이 앱을 표시하지 않습니까?

관련글

댓글

티스토리툴바