How to show images from HTML URL in Webview swift 4

Question

In one of my webservice response, i got html string which contains html url's of images also. I have to show that html string in a webview with that images. But what happed all html code display properly and instead of images , it shows boxes.

Following is the html string i got :

"<div dir=\"ltr\"><div dir=\"ltr\">Your invoice Rs.30<br clear=\"all\"><div><div dir=\"ltr\" class=\"gmail_signature\"><div dir=\"ltr\"><table width=\"600\" cellspacing=\"0\" cellpadding=\"0\" border=\"0\" style=\"color:rgb(0,0,0);font-family:&quot;Times New Roman&quot;;font-size:medium;width:600px\"><tbody><tr><td colspan=\"3\" style=\"font-family:Arial;margin-bottom:10px;font-stretch:normal;font-size:12px;line-height:normal;color:rgb(34,34,34);padding:0px 0px 10px\">Best Regards,<br><br><table width=\"600\" cellspacing=\"0\" cellpadding=\"0\" border=\"0\" style=\"color:rgb(0,0,0);font-family:&quot;Times New Roman&quot;;font-size:medium;width:600px\"><tbody><tr valign=\"top\"><td style=\"width:120px;padding-right:10px\"><a href=\"http://eluminoustechnologies.com/\" style=\"color:rgb(17,85,204);display:inline-block\" target=\"_blank\"><img src=\"http://eluminoustechnologies.com/signature/anniversary-signature.png\" alt=\"eluminous logo\" width=\"120\" height=\"\"></a></td><td width=\"500\" style=\"font-family:Arial;display:inline-block;text-align:initial;font-stretch:normal;font-size:12px;line-height:normal;color:rgb(100,100,100);padding:0px 10px;border-left:2px solid rgb(222,222,222)\"><table cellspacing=\"0\" cellpadding=\"0\" border=\"0\" width=\"100%\"><tbody><tr><td style=\"font-family:Arial;display:inline-block;text-align:initial;font-stretch:normal;font-size:18px;line-height:normal;color:rgb(34,34,34)\"><b>Sonali Vispute</b><br><span style=\"display:block;color:rgb(100,100,100);font-size:15px;padding-bottom:10px\">Software Engineer</span></td></tr></tbody></table><table cellspacing=\"0\" cellpadding=\"0\" border=\"0\" width=\"100%\"><tbody><tr><td style=\"font-stretch:normal;line-height:normal;padding:5px 0px\"><span style=\"color:rgb(239,135,32);font-family:Arial;display:inline-block;padding:0px 5px 0px 0px\"><strong>Skype</strong>:</span><font color=\"#222222\" face=\"Arial\">eluminous.se36</font></td></tr><tr><td style=\"padding-top:5px\"><a href=\"https://www.facebook.com/eluminoustech\" style=\"color:rgb(17,85,204)\" target=\"_blank\"><img src=\"http://eluminoustechnologies.com/signature/facebook.png\" width=\"21\" height=\"21\" style=\"border-radius: 0px; border: 0px; width: 21px; height: 21px; display: block; float: left; margin-right: 6px;\"></a>  <a href=\"http://www.linkedin.com/company/eluminous-technologies\" style=\"color:rgb(17,85,204)\" target=\"_blank\"><img src=\"http://eluminoustechnologies.com/signature/linkedin.png\" width=\"21\" height=\"21\" style=\"border-radius: 0px; border: 0px; width: 21px; height: 21px; display: block; float: left; margin-right: 6px;\"></a>  <a href=\"https://twitter.com/eluminoustech\" style=\"color:rgb(17,85,204)\" target=\"_blank\"><img src=\"http://eluminoustechnologies.com/signature/twitter.png\" width=\"21\" height=\"21\" style=\"border-radius: 0px; border: 0px; width: 21px; height: 21px; display: block; float: left; margin-right: 6px;\"></a>  <a href=\"https://plus.google.com/u/0/b/102274258265995536485/+eLuminousTechnologiesPvtLtdNashik/posts\" style=\"color:rgb(17,85,204)\" target=\"_blank\"><img src=\"http://eluminoustechnologies.com/signature/googleplus.png\" width=\"21\" height=\"21\" style=\"border-radius: 0px; border: 0px; width: 21px; height: 21px; display: block; float: left; margin-right: 6px;\"></a> </td></tr><tr><td style=\"padding-top:8px\"><p style=\"color:rgb(239,135,32);margin:0px\"><span style=\"font-family:Arial\">16 years of trust, commitment and co-operation</span><br></p></td></tr></tbody></table></td></tr></tbody></table></td></tr><tr></tr></tbody></table></div></div></div></div></div>\r\n"

Answer 1

webView.loadHTMLString("html String here", baseURL:"your base url here")

Answer 2

Images are not loaded because of Transport security.

Just Right click on your info.plist file Select Open As -> Source Code

Add the following lines in your info.plist file

<key>NSAppTransportSecurity</key>
    <dict>
        <key>NSAllowsArbitraryLoads</key>
        <true/>
    </dict>

Delete your app in simulator / iPhone and install it again. Your images from html now loaded in webview

i have loaded html with image using your html data. Check the below ss :

and finally add following line in viewDidLoad

webView.loadHTMLString("htmlString", baseURL: nil)

Answer 3

Just load UIWebView with html string

webView.loadHTMLString("htmlString", baseURL: nil)