Question

我是角度和网络开发的新手。我正在使用Visual Studio代码开发有角度的应用程序并将其部署在Azure上。我试图在以下提到的错误的所有相关文章中找到解决方案，但无法找到解决方案。我试图在首页上显示登录用户的名字和姓氏。用户使用Azure AD B2C登录。运行我的应用程序时，在浏览器控制台中出现以下错误

private String getPictureName() {
    SimpleDateFormat adf=new SimpleDateFormat("yyyyMMdd_HHmmss");
    String timestamp = adf.format(new Date());
    return "The New image"+timestamp+".jpg";//give a unique string so that the imagename cant be overlapped with other apps'image formats
}

我正在尝试在网页上显示用户的名字和姓氏。文件user.services.ts具有这样的代码

@Override
    protected void onActivityResult(int requestCode, int resultCode, Intent data) {
        super.onActivityResult(requestCode, resultCode, data);

        if(requestCode==PICK_IMAGE_REQUEST2 && resultCode==RESULT_OK )//&& data!=null && data.getData()!=null)
        {
            final ProgressDialog progressDialog = new ProgressDialog(this);
            progressDialog.setTitle("Uploading");
            progressDialog.show();
            Toast.makeText(getApplicationContext(),"2",Toast.LENGTH_SHORT).show();
                File picDir=Environment.getExternalStoragePublicDirectory(Environment.DIRECTORY_PICTURES);
            File imageFile=new File(picDir.getAbsoluteFile(),fi);
            filePath=Uri.fromFile(imageFile);
            try {
            }catch (Exception e)
            {
                e.printStackTrace();
            }



            StorageReference riversRef = storageReference.child(mAuth.getCurrentUser().getUid()+"/2");
            riversRef.putFile(filePath)
                    .addOnSuccessListener(new OnSuccessListener<UploadTask.TaskSnapshot>() {
                        @Override
                        public void onSuccess(UploadTask.TaskSnapshot taskSnapshot) {
                            progressDialog.dismiss();
                            Toast.makeText(getApplicationContext(), "File Uploaded ", Toast.LENGTH_LONG).show();
                        }
                    })
                    .addOnFailureListener(new OnFailureListener() {
                        @Override
                        public void onFailure(@NonNull Exception exception) {
                            progressDialog.dismiss();
                            Toast.makeText(getApplicationContext(), exception.getMessage(), Toast.LENGTH_LONG).show();
                        }
                    })
                    .addOnProgressListener(new OnProgressListener<UploadTask.TaskSnapshot>() {
                        @Override
                        public void onProgress(UploadTask.TaskSnapshot taskSnapshot) {
                            double progress = (100.0 * taskSnapshot.getBytesTransferred()) / taskSnapshot.getTotalByteCount();
                            progressDialog.setMessage("Uploaded " + ((int) progress) + "%...");
                        }
                    });

home.component.ts是

Failed to load resource: the server $%7Bthis.originUrl%7D/.auth/me:1 responded with a status of 404 (Not Found)

app.module.ts

 export class UserService {
 private originUrl: string;
 private aadUser: AADUser;

      constructor(private http: Http, @Inject('ORIGIN_URL')originUrl: string) {
     this.originUrl = originUrl;
 }
 public getUser(): Observable<User> {
    return this.http.get('${this.originUrl}/.auth/me')

Answer 1

使用以下步骤来解决错误，

以下@ user184994评论中的错误已解决

Failed to load resource: the server $%7Bthis.originUrl%7D/.auth/me:1 
responded with a status of 404 (Not Found)

第二个错误
```
No 'Access-Control-Allow-Origin' header is 
present on the requested resource. Origin 'localhost:5001'; is therefore 
not allowed access._
```
通过添加CROS扩展名（https://chrome.google.com/webstore/detail/allow-control-allow-origi/nlfbmbojpeacfghkpbjhddihlkkiljbi?hl=en-US）

但是我仍然无法在首页上显示用户的名字和姓氏。 home.component.html

    <script  src="../../Jquery/prettify.js"></script>
    <h1>Hello, {{user?.firstName}} {{user?.lastName}}!</h1>

user.services.ts代码是

    export class UserService {
    private originUrl: string;
    private aadUser: AADUser;

      constructor(private http: Http, @Inject('ORIGIN_URL')originUrl: string) {
     this.originUrl = originUrl;
   }
   public getUser(): Observable<User> {
    return this.http.get(`${this.originUrl}/.auth/me`)
        .map(response => {
            try {
                this.aadUser = response.json()[0] as AADUser;

                let user = new User();
                user.userId = this.aadUser.user_id;

                this.aadUser.user_claims.forEach(claim => {
                    switch (claim.typ) {
                        case 
             "http://schemas.xmlsoap.org/ws/2005/05/identity/claims/givenname":
                            user.firstName = claim.val;
                            break;
                        case 
             "http://schemas.xmlsoap.org/ws/2005/05/identity/claims/surname":
                            user.lastName = claim.val;
                            break;
                    }
                });

                return user;
            }
            catch (Exception) {
                 console.log('Error: ${Exception}');
            }
        }).catch(this.handleError);
       }
       private handleError(error: any): Promise<any> {
       console.error('An error occurred', error); // for demo purposes only
       return Promise.reject(error.message || error);
      }
      }

home.component.ts

      @Component({
      selector: 'app-home',
      templateUrl: './home.component.html',
      })
      export class HomeComponent implements OnInit {
      constructor(private userService: UserService) { }
      user: User;
      ngOnInit(): void {
      this.userService.getUser().subscribe(user => this.user = user );
      }

无法加载资源：服务器$％7Bthis.originUrl％7D / .auth / me：1状态404（未找到）

1 个答案: