How to handle URL Image if has non English characters SwiftUI

Question

Created Feb ’21

Replies 8

Boosts 0

Views 1.6k

Participants 2

Im displaying url images in my app with WebImage but some of them has non English characters in the path so they are not displaying in view.How can I handle non English characters in Url ımage ?

Code Block languageLazyVGrid(columns: Array(repeating: GridItem(.flexible(),spacing: 20), count: data.column ?? 1), spacing:30 ) {
                
                ForEach(data.options ?? [] , id :\.id ){ item in
                    
                    NavigationLink(destination: ViewParser.create(item: item,index: item.typeArry ?? [])) {
                        
                        VStack(alignment: .leading, spacing: 15) {
                            
                            WebImage(url: URL(string: item.image ?? ""))
                                .resizable()
                                .aspectRatio(CGFloat(data.ratio ?? 1),contentMode: .fit)
                                .cornerRadius(isColumnOne ? 12 : 0)
                                .padding(.horizontal , 1)
                            
                        }
                    }
                    
                }
                
            }

Boost

Answer 1

OOPer OP

Feb ’21

Can you explain what is WebImage, and show us some examples of the paths containing non-English characters?

0

Answer 2

ally_dln OP

Feb ’21

WebImage is a library for displaying URL Images as you can see in here ; https://github.com/SDWebImage/SDWebImageSwiftUI

And this is one of the URL it has non English character(it comes from backend server) :
cdn.marasmarket.com//Data/EditorFiles/mobil_uygulama/YöreselTatlar.jpg

As you can see its include "ö" which is non English character .

0

Answer 3

OOPer OP

Feb ’21

Accepted Answer

Thanks for the explanation and showing the result.

Technically, non-ASCII characters like "ö" are not allowed in URLs and needs to be escaped using percent-encoding.
(Unfortunately, some browsers do this conversion automatically and hidden from users.)

You can try something like this:

Code Block             WebImage(url: URL(string: item.image?.addingPercentEncoding(withAllowedCharacters: .urlPathAllowed) ?? ""))

Or, it would be better to set already percent-encoded string to the property image.

1

Answer 4

ally_dln OP

Feb ’21

I tried that but unfortunately it didn't work. its not display anything .

0

Answer 5

ally_dln OP

Feb ’21

i solved the problem. instead of .urlPathAllowed -> urlQueryAllowed and it worked. Thank you so much for help.

0

Answer 6

OOPer OP

Feb ’21

its not display anything .

Then your item.image is not what I expect. Are you sure it does not contain schemes like https:// as you have shown as an example?

UPDATE

i solved the problem. instead of .urlPathAllowed -> urlQueryAllowed and it worked. Thank you so much for help.

Happy to hear you solved your issue. If urlQueryAllowed worked, I guess your image contained scheme.

1

Answer 7

ally_dln OP

Feb ’21

Actually it does the reason I didn't write https:// because site didn't allow me to write scheme that's why I write url without scheme.

0

Answer 8

OOPer OP

Feb ’21

site didn't allow me to write scheme that's why I write url without scheme.

I see. A really annoying restriction.

0