programing

유형 오류: firebase.storage가 기능하지 않습니다.

abcjava 2023. 6. 10. 07:54
반응형

유형 오류: firebase.storage가 기능하지 않습니다.

다음 예제를 수행하면 다음 오류가 계속 발생합니다.

 TypeError: firebase.storage is not a function

내 코드의 이 행에서:

var storageRef = firebase.storage().ref();

(또한 Firebase의 npm 사이트에서 연결된 스토리지 가이드에서 스토리지를 초기화하려고 하면 동일한 오류가 발생합니다.)

Node.js 프로젝트에는 다음 라이브러리가 포함되어 있습니다.

  • const firebase = require('firebase');
  • var admin = require('firebase-admin');
  • const fs = require('fs');

저는 데이터베이스를 쓸 수 , 지금다저, 는성으이스데, 파베이니로 var db = admin.database(),그리고나서var ref = db.ref("/")Firebase 및 Firebase 데이터베이스를 올바르게 구성했습니다. 저는 ㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅜㅜㅜㅜㅜㅜㅜㅜㅜㅜㅜㅜㅜㅜㅜㅠstorage그리고 두 가지를 모두 시도했습니다.admin.storage().ref()그리고.firebase.storage().ref(),그리고.firebase.storage().ref("/")동일한 오류 메시지가 표시됩니다.

저도 해봤어요.

var storage = firbase.storage();
var storageRef = storage.ref();

그리고.

const app = firebase.initializeApp(config);
var storage = app.storage();

와께함과 함께ref() 인수 의효 주장무() 와께함과 함께"/"하지만 같은 메시지를 가지고 있지만, 아직 소용이 없습니다.

사용 중:

  • "파이어베이스": "^3.6.4"
  • "firebase-admin": "^4.0.4"
  • Node.js : v6.9.1

스토리지에 대한 참조를 만들려면 어떻게 해야 합니까?

저도 같은 문제에 직면했습니다.저의 경우, Firebase core 외에 스토리지 모듈을 포함해야 했습니다.

import firebase from 'firebase/app';
import 'firebase/storage';  // <----

firebase.initializeApp({
  ...
});
const storageRef = firebase.storage().ref();

(npm Firebase v5.0.4)

사용되지 않습니다. 아래를 참조하십시오.

답변에 따르면, Firebase 스토리지 대신 Node.js에서google-cloud패키지 스토리지를 사용해야 하며, 이 답변은 이를 확인해야 할 으로 보입니다.코드 예:

npm i --save google-cloud

그러면:

const gcloud = require('google-cloud')

const storage = gcloud.storage({
    projectId: '<projectID>',
    keyFilename: 'service-account-credentials.json',
});

const bucket = storage.bucket('<projectID>.appspot.com')

2018년 기준 정답은 다음과 같습니다.

또는 패키지의 저장 부분만 사용하는 경우:

npm install --save @google-cloud/storage

그리고 나서:

var storage = require('@google-cloud/storage')

자세한 내용은 문서를 확인하십시오.

사용되지 않음: 승인된 답변을 참조하십시오.

참고해야 할 몇 가지 세부 사항:

  1. Firebase Storage는 더 이상 Node.js와 함께 사용되지 않으므로 Node.js에 대한 모든 설명서는 사용할 수 없습니다.대신에, 신대사를 하세요.google-cloud현재 Firebase 및 Google Cloud에 대한 참조 및 가이드에는 이 내용이 포함되어 있지 않습니다.
  2. 파이어베이스와 달리 구글 클라우드는 소규모 프로젝트에도 비용이 듭니다.
  3. 저의 경우, SDK를 사용하고 있기 때문에 현재 사용자 인증을 방해할 필요가 없습니다.

목적

Firebase 및 Google Cloud를 사용하는 단일 Node.js 프로젝트를 만드는 것입니다. 이유는 무엇입니까?Firebase에는 여러 기능 중에서도 유용한 데이터베이스가 있으며, Google Cloud를 통해 클라우드 파일을 저장하고 검색할 수 있습니다.

방향.

1단계: 프로젝트 생성

Firebase 및 Google 클라우드(스토리지) 프로젝트를 만듭니다.

2단계: 패키지 설치

npm을 사용하여 설치 및 설치Node.js프로젝트.

참고 1: 관리 SDK를 사용했으므로 Firebase 프로젝트를 만든 후 다음으로 이동해야 합니다.

  • 설정(기어) > 프로젝트 설정 > 서비스 계정 > Firebase Admin SDK
  • 을 선택하세요: 을 선택합니다.Node.js [ 복사> ["새 키 생성" 클릭> [된 키 ] > [생성된 키 다운로드] > ["생성된 키 다운로드] > ["생성된 개인 키" ["생성된 키 다운로드]] > [생성된 키를 복사/붙여넣기]json> [하기] > [대체하기]"path/to...AccountKey.json"하여] 생성된 키의 경로는 다음과 같습니다.

참고 2: 생성된 키는 Firebase 또는 Google 클라우드 자격 증명에서 재사용할 수 있습니다.

3단계: Firebase 설정

프로젝트가 생성되면 sdk를 가져옵니다.

코드는 다음과 같이 표시되어야 하지만 사용자의 정보로 채워집니다.

var admin = require("firebase-admin");
admin.initializeApp({
  credential: admin.credential.cert("/path/to/generated/json/here.json"),
  databaseURL: "database-url-from-firebase"
});

URL을 하여 "Firebase" ''로 하는 URL을 하십시오.gs:의 값 합니다.URL.

그런 다음 사용할 수 있는 데이터베이스에 대한 참조를 가져옵니다.

var db = admin.database();
var ref = db.ref("/");
console.log('DB ref: ' + ref); //just to debug, if undefined, there's a problem.

데이터베이스 읽기/쓰기에 대한 자세한 내용은 Firebase의 문서를 참조하십시오.

4단계: Google-Cloud 청구 설정

Google Cloud에서 프로젝트를 만든 후 청구 정보를 추가합니다. 청구 정보가 없으면 버킷을 사용할 수 없습니다.

5단계: Google-Cloud 스토리지 설정

  1. 메뉴(수평 3개 막대)를 스크롤하여 "스토리지"를 클릭한 다음 "청구 사용"을 클릭합니다.예, 청구 정보를 추가했습니다. 이제 해당 프로젝트의 버킷에 대해 청구 정보를 활성화해야 합니다.
  2. Firebase 프로젝트에서 버킷이 이미 존재해야 합니다.
  3. 메뉴 다시 클릭(3bar 아이콘) 후 > IAM & Admin > Settings
  4. 설정에서 "projectName-00000" 또는 "projectName-Some#"과 같은 "ProjectID"가 표시되고 해당 프로젝트 ID를 복사합니다.

6단계: Node.js의 Google 클라우드

의 신의에서.index.js:

var gcloud = require('google-cloud');
var gcs = gcloud.storage({
  projectId: 'paste-that-project-id-here',
  keyFilename: 'paste-that-path-to-the-previously-downloaded-json-from-firebase-here'
});

이제 다음 방법으로 스토리지에 파일을 보낼 수 있습니다.

var bucket = gcs.bucket('bucket_name');
var remoteFile = bucket.file('somefile-inThisCaseASong.mp3');
var localFilename = '/Users/you/Music/somefile-inThisCaseASong.mp3';
bucket.upload(localFilename, function(err, file) {
  if (!err) {
    console.log('somefile-inThisCaseASong.mp3 is now in your bucket.');
  } else {
    console.log('Error uploading file: ' + err);
  }
});

7단계: 확인

Firebase Storage 및 Google Cloud Storage에 파일이 표시되면 완료됩니다!

2020년 답변, 저의 경우 .html 파일에 firebase-storage.js를 포함합니다.

<script src="https://www.gstatic.com/firebasejs/6.5.0/firebase-storage.js"></script>  

그러므로, 만약 당신이 모든 Firebase 서비스를 사용한다면, 당신은

<script src="https://www.gstatic.com/firebasejs/6.5.0/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/6.5.0/firebase-auth.js"></script>
<script src="https://www.gstatic.com/firebasejs/6.5.0/firebase-firestore.js"></script>  
<script src="https://www.gstatic.com/firebasejs/6.5.0/firebase-messaging.js"></script>  
<script src="https://www.gstatic.com/firebasejs/6.5.0/firebase-storage.js"></script>  


<!-- your script calling Firebase Firestore under this line -->
<script> 
....
</script>

저도 같은 문제가 있었습니다. 제 코드는 다음과 같습니다.

import * as firebase from "firebase/app";
import 'firebase/storage';

firebase.initializeApp({
  ...
});
const storageRef = firebase.storage().ref();

Typescript를 사용하는 경우에만 사용할 수 있습니다.

ES6만 사용하는 경우 다음이 필요합니다.

import firebase from 'firebase/app';
import 'firebase/storage';

firebase.initializeApp({
  ...
});
const storageRef = firebase.storage().ref(); 

ES5를 사용하는 경우 다음이 필요합니다.

var firebase = require("firebase/app");
require("firebase/storage");

firebase.initializeApp({
  ...
});
const storageRef = firebase.storage().ref();

또한 다음과 같은 방법도 사용할 수 있지만 모든 서비스(데이터베이스, 인증, 스토리지 등)를 로드하기 때문에 권장되지 않습니다.

import firebase from "firebase";

firebase.initializeApp({
  ...
});
const storageRef = firebase.storage().ref();

Firebase 7.15.2로 테스트됨

Firebase와 함께 스토리지를 사용하는 경우 사용 가능한 계층에 버킷을 추가할 수 없습니다.그러나 기본적으로 버킷(하나만)을 받습니다.저의 (결국) 성공적인 접근 방식은 다음과 같습니다.

  1. Firebase의 프로젝트에 스토리지 추가(Google 클라우드 제외)

  2. Google Docs: https://firebase.google.com/docs/admin/setup?authuser=1 에 따라 Admin SDK를 추가하고 필요한 서비스 계정을 설정합니다.

  3. 추가합니다.@google-cloud/storage관리 SDK를 스토리지와 함께 사용하는 방법에 대한 지침에 따라 패키지화합니다. https://firebase.google.com/docs/storage/admin/start?authuser=1

  4. 앱 초기화:

    admin.initializeApp({
      credential: admin.credential.cert("/path/to/generated/json/here.json"),
      storageBucket: "folder-URL-from-Storage-page-excluding-gs://"
    });
    
  5. 관리 SDK 문서에서 버킷 개체에 액세스합니다.

    const bucket = admin.storage().bucket();

  6. 저장소 라이브러리를 사용하여 버킷에서 작업합니다.예:

    bucket.upload('/path/file.ext', function(err, file, apiResponse) {
      //Do Stuff
    });
    

참고: 양동이가 없어서 작동하지 않는다고 확신하는 데 몇 시간을 보냈지만, 알고 보니 제 실수는 양동이를 포함한 것이었습니다.gs://초기화할 때 스토리지 버킷의 경로에 있습니다.

버전 9용으로 업데이트됨

import { initializeApp } from "firebase/app";
import { getStorage } from "firebase/storage";

// Set the configuration for your app
// TODO: Replace with your app's config object
const firebaseConfig = {
  apiKey: '<your-api-key>',
  authDomain: '<your-auth-domain>',
  databaseURL: '<your-database-url>',
  storageBucket: '<your-storage-bucket-url>'
};
const firebaseApp = initializeApp(firebaseConfig);

// Get a reference to the storage service, which is used to create references in your storage bucket
const storage = getStorage(firebaseApp);

출처: https://firebase.google.com/docs/storage/web/start

HTML 파일 < src="https://www.gstatic.com/firebasejs/7.12.0/firebase-storage.js "에 이 src가 있는 스크립트 태그를 프로젝트에 추가했는지 확인합니다.

  • 여기서 7.12.0은 현재 작동 중인 버전으로 대체됩니다.

파이어베이스의 V9은 스토리지를 사용할 수 있는 다른 방법이 있다고 생각합니다.Firebase 스토리지를 사용하는 경우 스토리지를 다음과 같이 가져올 수 있습니다.

import { getStorage } from "firebase/storage";

이제 당신은 이것을 따를 수 있습니다.

const firebaseApp = firebase.initializeApp(firebaseConfig);

const storage = getStorage(firebaseApp);

당신이 다음과 같이 하려고 하면 변경됩니까?

// Initialize the default app:
const app = firebase.initializeApp(appConfig)

// Initialize storage from the *app* object:
const storage = app.storage()

서류상으로는 이것이 대안적인 방법인 것 같습니다.저는 이것이 스토리지를 앱에 연결하여 코드를 더 읽기 쉽고 더 기능적으로 만들기 때문에 이것을 선호합니다.

firebase.storage()를 사용할 수 있었지만, 이를 파악하는 데 시간이 좀 걸렸습니다.다음과 같이 가져올 때만 작동합니다.

//Importing
const firebase = require('firebase')
require('firebase/storage')

//Calling the function (You can call it normally then)
const storageRef = firebase.storage().ref();

Firebase.storage()로 가져오려고 하거나 다른 작업을 할 때마다 작동하지 않습니다!당신들 중 몇몇에게 도움이 되길 바랍니다.

app. initialize app.vmdk initialize app.vmdkimport firebase from 'firebase/app';import 'firebase/storage';

firebase.storage();

그들은 도서관의 새로운 버전에서 그것을 고친 것 같습니다.그냥 도망가npm update해당 패키지에 포함되어 있어야 합니다.

앱을 로컬로 테스트할 때도 동일한 문제가 발생하지만 프로젝트가 배포되면 모든 것이 작동합니다.

이러한 방법으로 실제로 다음 해결 방법을 사용합니다.

if (!firebase.storage) {
    // prevent crash when working locally
    return;
}
let ref = firebase.storage().ref()
// perform production stuff ...

조금 궁금하긴 하지만, 제 경우에는 효과가 있습니다.

파이어베이스 스토리지 서비스는 여전히 브라우저에서 작동합니다(그리고 AFAIK는 더 이상 사용되지 않습니다.파이어베이스 스토리지 서비스는 서버 측 렌더링 중을 포함한 서버 환경에서는 사용할 수 없습니다.

제가 이렇게 해냈습니다.

// only import uploadHandler client-side.
const uploadHandler = typeof window === 'object' ? require('./handlers').imageHandler : () => false; // ssr only

그럼 인handlers.js당신은 안전하게 소방 기지 보관 서비스를 정상적으로 사용할 수 있습니다.

import * as firebase from 'firebase'
const storageRef = firebase.storage().ref();
const bucketObjectRef = storageRef.child('myFile.jpg');

2020년 4월 3일 현재 브라우저 환경에서 전체 파이어베이스 제품군이 여전히 지원되는 것으로 보입니다.

화재 기지 환경 지원 표

출처: https://firebase.google.com/docs/web/setup#namespace

브라우저(webapp)에서 Firebase의 스토리지를 통합할 때 비슷한 문제가 발생했습니다.

  <script src="https://www.gstatic.com/firebasejs/7.15.0/firebase-storage.js"></script>

그 선만 더하면 벌레가 사라집니다!

'firebase/app'에서 firebase로 * 가져오기;

그런 다음 firebase.storage().ref()가 작동해야 합니다.

이게 도움이 되길 바랍니다.

언급URL : https://stackoverflow.com/questions/41352150/typeerror-firebase-storage-is-not-a-function

반응형