异步图片加载错误

泰勒·贝尔

我在遇到异步图像加载时遇到了一个奇怪的错误,当我进入视图时,应该按照预期进行显示,然后由于某种原因图像掉落,我所看到的只是“加载中...”。占位符。在构建加载器时使用了本教程,以下脚本是我的文章视图。我有一个全局函数文件,其中包含对应用程序中各种功能的合并和基础的引用。我只是不完全理解为什么图像会短暂显示,然后调用占位符。谢谢!

import SwiftUI

struct ArticleView: View {
    @Environment(\.imageCache) var cache: ImageCache
    var articleID: Int
    @ObservedObject private var data = Result2()
    let defaults = UserDefaults.standard
    
    @Environment(\.presentationMode) var presentationMode: Binding<PresentationMode>
    
    init(articleID: Int){
        self.articleID = articleID
        self.data.results.append(Story.init(id: 0, title: "test", image: "", story: "", published: "", author: ""))
        self.loadArticle(CDNLink: "http://\(self.defaults.object(forKey: "domain") as! String)/cdn?funct=fetchArticle&articleID=\(self.articleID)")
    }
    
    var backBtn: some View {
        Button(action: {
            self.presentationMode.wrappedValue.dismiss()
        }, label:{
            Image(systemName: "lessthan.circle")
                .resizable()
                .frame(width: 30, height: 30)
                .foregroundColor(Color.primaryRed)
                .padding(.top, 6)
                .padding(.leading, 10)
        })
    }
    
    var body: some View {
        VStack(alignment: .leading){
            ScrollView {
                ForEach(data.results, id: \.id) { result in
                Group{
                    AsyncImage(
                        url: URL(string: result.image)!,
                        placeholder: Text("Loading..."), configuration: { $0.resizable() })
                        .frame(height: 250)
                        .aspectRatio(contentMode: .fill)
                    VStack(alignment: .leading) {
                        Text("\(result.title)")
                            .font(.system(size: 18))
                            .fontWeight(.heavy)
                            .foregroundColor(.primary)
                            .multilineTextAlignment(.leading)
                        HStack {
                            Text("\(result.author)")
                                .font(.system(size: 12))
                                .foregroundColor(.secondary)
                                .multilineTextAlignment(.leading)
                            Text("|")
                                .font(.system(size: 12))
                                .foregroundColor(.secondary)
                                .multilineTextAlignment(.leading)
                            Text("\(result.published)")
                                .font(.system(size: 12))
                                .foregroundColor(.secondary)
                                .multilineTextAlignment(.leading)
                        }.frame(width: UIScreen.main.bounds.size.width - 40, alignment: .leading)
                    }.frame(width: UIScreen.main.bounds.size.width - 40)
                }
                    Text("\(result.story)")
                }
            }
        }
        .frame(maxWidth: .infinity)
        .navigationBarBackButtonHidden(true)
        .navigationBarItems(leading: backBtn)
    }

    func loadArticle(CDNLink: String) {
    guard let url = URL(string: CDNLink) else {
        print("Invalid URL")
        return
    }
    
    let request = URLRequest(url: url)
    
    URLSession.shared.dataTask(with: request) { data, response, error in
        if error != nil {
            print("Fetch failed: \(error?.localizedDescription ?? "Unknown error")")
            return
        } else {
            do {
                let decodedResponse = try JSONDecoder().decode(Response2.self, from: data!)
                print(decodedResponse)
                DispatchQueue.main.async {
                    self.data.results.append(contentsOf: decodedResponse.results)
                    self.data.results.remove(at: 0)
                }
                } catch let err {
                    print("Error parsing: \(err)")

                }
            }
        }.resume()
    }
}

struct Response2: Codable {
    var results: [Story]
}

struct Story: Codable, Identifiable {
    var id: Int
    var title: String
    var image: String
    var story: String
    var published: String
    var author: String
}

struct ArticleView_Previews: PreviewProvider {
    static var previews: some View {
        ArticleView(articleID: 0)
    }
}

编辑:我已经提出了建议的更改,但是我仍然看到错误,您可以通过签出此链接实时查看错误

泰勒·贝尔

好的,所以我创建了一个新的解决方案来修补此问题,并且很高兴能解决这一小问题。因此,我开始研究如何在服务器端进行操作以优化被拉入应用程序的内容。我所做的是使用PHP用base64编码图像,然后应用将其拉入并解码base64数据,并且图像以闪电般的速度填充!

服务器端代码:

$article['image'] = base64_encode(file_get_contents(PATH . "/cache/content/topstory/" . $row['app_article']));

客户端代码:

let dataDecoded:NSData = NSData(base64Encoded: result.image, options: NSData.Base64DecodingOptions(rawValue: 0))!
let decodedimage:UIImage = UIImage(data: dataDecoded as Data)!
Image(uiImage: decodedimage)
   .frame(height: 250)
   .aspectRatio(contentMode: .fill)

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

快速滚动时错误地将图片异步加载到UITableView-cell中

来自分类Dev

砌体和图片加载错误

来自分类Dev

从图库加载图片,返回错误

来自分类Dev

Kivy异步图片-无法加载静态Google API

来自分类Dev

js中图片异步加载可能出现的问题

来自分类Dev

UICollectionViewCell中图片异步加载导致标签消失

来自分类Dev

angularJS背景图片加载错误

来自分类Dev

在图片框C#中加载图片时出现错误

来自分类Dev

IE中的Google Maps异步加载错误

来自分类Dev

IE中的Google Maps异步加载错误

来自分类Dev

局部视图异步加载,未加载,无错误

来自分类Dev

尝试加载库;收到“错误图片”错误

来自分类Dev

尝试加载库;收到“错误图片”错误

来自分类Dev

第一次错误使用Picasso加载图片

来自分类Dev

GoogleAPI PanoView StreetView错误-图片无法正确加载

来自分类Dev

GitHub Pages-图片未加载-404错误

来自分类Dev

有时只会触发图片加载错误

来自分类Dev

GoogleAPI PanoView StreetView错误-图片无法正确加载

来自分类Dev

HTML图片在页面加载时以及异步等待事件后未正确更新

来自分类Dev

自动布局,将图片异步加载到uiimageview中(Swift,xCode6)

来自分类Dev

使用 MongoDB 进行异步图片库加载的最佳 JS 框架

来自分类Dev

Windows Phone Universal App错误在加载时调用异步功能

来自分类Dev

移动版Safari / Chrome浏览器中出现图片错误加载占位符图片问题

来自分类Dev

移动版Safari / Chrome浏览器中出现图片错误加载占位符图片问题

来自分类Dev

反应:背景图片加载时显示加载器会导致setState错误

来自分类Dev

反应:背景图片加载时显示加载器会导致setState错误

来自分类Dev

从UITableView单元内的URL异步加载图像-滚动时加载错误的图像

来自分类Dev

延迟加载图片元素

来自分类Dev

图片加载失败

Related 相关文章

  1. 1

    快速滚动时错误地将图片异步加载到UITableView-cell中

  2. 2

    砌体和图片加载错误

  3. 3

    从图库加载图片,返回错误

  4. 4

    Kivy异步图片-无法加载静态Google API

  5. 5

    js中图片异步加载可能出现的问题

  6. 6

    UICollectionViewCell中图片异步加载导致标签消失

  7. 7

    angularJS背景图片加载错误

  8. 8

    在图片框C#中加载图片时出现错误

  9. 9

    IE中的Google Maps异步加载错误

  10. 10

    IE中的Google Maps异步加载错误

  11. 11

    局部视图异步加载,未加载,无错误

  12. 12

    尝试加载库;收到“错误图片”错误

  13. 13

    尝试加载库;收到“错误图片”错误

  14. 14

    第一次错误使用Picasso加载图片

  15. 15

    GoogleAPI PanoView StreetView错误-图片无法正确加载

  16. 16

    GitHub Pages-图片未加载-404错误

  17. 17

    有时只会触发图片加载错误

  18. 18

    GoogleAPI PanoView StreetView错误-图片无法正确加载

  19. 19

    HTML图片在页面加载时以及异步等待事件后未正确更新

  20. 20

    自动布局,将图片异步加载到uiimageview中(Swift,xCode6)

  21. 21

    使用 MongoDB 进行异步图片库加载的最佳 JS 框架

  22. 22

    Windows Phone Universal App错误在加载时调用异步功能

  23. 23

    移动版Safari / Chrome浏览器中出现图片错误加载占位符图片问题

  24. 24

    移动版Safari / Chrome浏览器中出现图片错误加载占位符图片问题

  25. 25

    反应:背景图片加载时显示加载器会导致setState错误

  26. 26

    反应:背景图片加载时显示加载器会导致setState错误

  27. 27

    从UITableView单元内的URL异步加载图像-滚动时加载错误的图像

  28. 28

    延迟加载图片元素

  29. 29

    图片加载失败

热门标签

归档